
 <md-tabs md-stretch-tabs="always" class="md-primary" md-dynamic-height md-border-bottom >
        <md-tab id="tab1" aria-controls="Tab 1">
            <md-tab-label>Info</md-tab-label>
            <md-tab-body layout="column">
            {{imagePath}}
    <md-card class="flex" ng-controller="PrinterCtrl">
      
      <md-card-content>

        <md-list>

          <md-list-item class="md-2-line">
            <div class="md-list-item-text">
              <h3>Current Connection</h3>
              <h4>{{connection}}</h4>
              {{model.value}}
            </div>
          </md-list-item>

          <md-list-item class="md-2-line">
            <div class="md-list-item-text">
              <h3>Status</h3>
              <h4>{{status}}</h4>
            </div>
          </md-list-item>

          
        </md-list>

      </md-card-content>

      <md-divider></md-divider>

      <md-card-content>

        <md-list>
          

          <md-list-item class="md-3-line">
            <div class="md-list-item flex">
            {{selectedprinter}} and 
            {{progress}}
             <md-input-container class="md-block">
                <label>Available Printers</label>
                <md-select name="myModel" placeholder="Printer" ng-model="selectedprinter">
                <md-option ng-repeat="printer in printers" value="{{printer.name}}">{{printer.name}}</md-option>
                </md-select>
                <div class="errors" ng-messages="myForm.myModel.$error" ng-if="myForm.$dirty">
                  <div ng-message="required">Required</div>
                </div>
             </md-input-container>
         

            </div>
            
          </md-list-item>
        </md-list>
        <md-card-actions layout="row" layout-align="end center">
          <md-button>Connect</md-button>
          <md-button>Stop</md-button>
        </md-card-actions>

      </md-card-content>




    </md-card>
            
              
            </md-tab-body>
        </md-tab>

        <md-tab id="tab2" aria-controls="Tab 2" md-dynamic-height md-border-bottom>
          <md-tab-label>Job</md-tab-label>
          <md-tab-body>

            <!-- <job flex></job> -->

            <md-card flex ng-controller="PrinterCtrl">
      <!-- <md-toolbar class="md-theme-light">
        <h2 class="md-toolbar-tools">
          <span>Job</span>
        </h2>
      </md-toolbar> -->
      <div style="display:block;">
        <img ng-src="{{imagePath}}" class="md-card-image" alt="{{altImagePath}}" style="width:100%;height:100%;display:inline-block;">
      </div>
      <md-card-content class="flex-100">
        <h2 class="md-title">Paracosm</h2>
        <!-- <md-progress-linear md-mode="determinate" value="{{vm.determinateValue}}"></md-progress-linear> -->
        <md-progress-linear md-mode="indeterminate"></md-progress-linear>
        {{value}}
        <md-list>
          <md-list-item class="md-2-line">
            <div class="md-list-item-text">
              <h3>Progress</h3>
              <h4>{{progress}}</h4>
            </div>
            
            
          </md-list-item>

          <md-list-item class="md-2-line">
            <div class="md-list-item-text">
              <h3>Cost</h3>
              <h4>{{cost}}</h4>
            </div>
            
            
          </md-list-item>

          
        </md-list>

      </md-card-content>
      
    </md-card>

          </md-tab-body>
    </md-tabs>


